import {Component} from 'react';
import {Navigate, Route, Routes} from "react-router-dom";
import RouteLink from "@/components/RouteLink/index.jsx";
import AboutUs from "@/components/AboutUs/index.jsx";
import Home from "@/components/Home/index.jsx";
import './index.scss'

class RouteDemo extends Component {
  render() {
    return (
      <div>
        <h2>我是通用头</h2>
        <div>
          <RouteLink to={`/about-us?id=1&name='cc'`}>关于我们</RouteLink>
          <RouteLink to={`/home?content=333`}>首页</RouteLink>
        </div>

        {/*注册路由*/}
        <div>
          <Routes>
            {/*路由匹配到后就不再往下匹配*/}
            <Route element={<AboutUs/>} path='/about-us'/>
            <Route element={<Home/>} path='/home'/>
            {/*重定向*/}
            <Route path='/' element={<Navigate to='/home'/>} />
          </Routes>
        </div>
      </div>
    );
  }
}

export default RouteDemo;
